.account-module {
    height: calc(100% - 2px);
    padding: 0px 0px;
    display: flex;
    justify-content: center;

    .login {
        width: 100%;
        min-height: 750px;
        position: relative;

        .logo {
            padding-top: 80px;
            text-align: right;
            padding-right: 120px;


            .bg2 {

                width: 313px;

            }

        }

        .m {
            display: flex;
            justify-content: flex-end;
            padding-right: 175px;
            margin-top: 60px;

            .bgword {
                width: 580px;
                height: 234px;
                margin-right: 355px;
                //margin-top: 100px;
            }
            .ercode {
                width: 250px;
                height: 310px;
                margin-left: 180px;
                img {
                    width: 250px;
                    height: 250px;
                }
            }

            .content {
                width: 350px;
                background: #FFFFFF;
                box-shadow: 0px 4px 14px 4px rgba(17, 39, 80, 0.1);
                border-radius: 16px;
                min-height: 100px;
                padding: 0px 45px;
                height: 500px;

                .title {
                    font-size: 24px;
                    font-weight: $font-weight-bold;
                    text-align: center;
                    padding: 50px 0px 24px;
                }

                .item {
                    width: 340px;
                    margin: 21px 0px 0px;
                    height: 50px;
                    display: flex;
                    align-items: center;

                    background: #F5F7FA;
                    border-radius: 8px;

                    .gb {
                        width: 55px;
                        text-align: center;
                        position: relative;

                        &::after {
                            content: "";
                            position: absolute;
                            right: 0px;
                            width: 1px;
                            height: 20px;
                            background: #DEE0E3;
                            top: 50%;
                            margin-top: -10px;
                        }
                    }

                    .code {
                        padding: 0px 16px;
                        color: $color-primary;
                        cursor: pointer;
                        font-size: 16px;
                    }

                    input {
                        flex: 1;
                        height: 80%;
                        outline: none;
                        padding-left: 15px;
                        background: none;
                        border: 0;
                        font-size: 16px;
                    }

                    @include input-placeholder(#959CA9);

                }

                .agreement {
                    color: #959CA9;
                    font-size: 12px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-top: 41px;

                    .el-checkbox {
                        margin-right: 5px;
                    }

                    .el-button {
                        font-size: 12px;
                    }
                }

                .btn {
                    line-height: 50px;
                    background: #00A0E9;
                    border-radius: 8px;
                    color: #FFFFFF;
                    text-align: center;
                    margin: 12px 0px;
                    font-size: 16px;
                }

                .btn-c {
                    margin-top: 40px;
                }

                .url {
                    text-align: right;

                    .one {
                        text-decoration: none;
                        color: #959CA9;
                    }
                }
            }

        }

    }

    .register {
        width: 100%;
        .header {
            height: 64px;
            display: flex;
            justify-content: space-between;
            //margin: 0px -20px;
            padding: 0px 20px;
            align-items: center;
            background: #00A0E9;

            .left {
                display: flex;
                align-items: center;
                height: 100%;

                .min {
                    height: 60%;
                }

                .title {
                    color: #FFFFFF;
                    margin-left: 20px;
                    font-weight: bold;
                    font-size: 18px;

                }
            }

            .logo {
                height: 80%;
            }
        }

        .c {
            background: #FFFFFF;
            border-radius: 12px;
            position: relative;
            margin: 30px auto 0px;

            .regisetr-title {
                text-align: center;
                font-size: 24px;
                font-weight: bold;
                margin-bottom: 25px;
            }

            .ruleForm {
                padding: 30px 0px 3px 30px;

                .el-input {
                    width: 220px;
                }

                .el-select {
                    width: 220px;
                }

                .hint-input {
                    margin-bottom: -10px;

                    .hint {
                        margin-top: -5px;
                        font-size: 12px;
                        color: #c77f4c;
                        margin-bottom: 5px;
                    }
                }



                .agreement {
                    width: 100%;
                    text-align: center;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    padding: 5px 0px 5px;

                    span {
                        color: #D9161C;
                        margin-left: -25px;
                    }
                }

                .btn-code {
                    width: 98px;
                    line-height: 32px;
                    background: #EFF6FF;
                    border-radius: 4px;
                    text-align: center;
                    color: $color-primary;
                    margin-left: 12px;
                    cursor: pointer;
                }

                .btns {
                    width: 100%;
                    text-align: center;

                    .el-button {
                        height: 38px;
                    }
                }

            }

            .uplods {
                position: absolute;
                top: 330px;
                right: 118px;
                width: 490px;



            }

            .avatar-uploader {
                display: flex;
                align-items: flex-start;
                margin-bottom: 20px;


                .title {
                    width: 160px;
                    text-align: right;
                    font-size: 16px;
                    font-weight: $font-weight-bold;
                    margin-right: 12px;
                    margin-top: -90px;
                }

                .image {
                    width: 120px;
                    height: 120px;
                    background: rgba(222, 224, 227, 0.23);
                    border-radius: 4px;
                    border: 1px solid #DEE0E3;

                    >.img {
                        width: 100%;
                        height: 100%;
                    }

                    .upload {
                        padding-top: 30px;

                        img {
                            width: 24px;
                            height: 24px;
                            display: block;
                            margin: auto;
                        }

                        .text {
                            text-align: center;
                            margin-top: 8px;
                            color: #959CA9;
                            font-size: 14px;
                        }
                    }
                }

                .image1 {
                    height: 130px;
                    width: 160px;

                    .title {
                        margin-top: -100px;
                    }
                }

                .hint {
                    color: #c77f4c;
                    line-height: 16px;
                    margin-left: 12px;
                }
            }

        }
    }
}

@media (max-width: 1550px) {
    .account-module {

        .login {
            .m {

                padding: 0px 60px;
                justify-content: space-between;

                .bgword {
                    margin-right: 0px;
                }
            }

        }
    }
}

@media (max-height: 800px) {
    .account-module {

        .login {
            .logo {
                padding-top: 40px;
            }
            .m {
                margin-top: 40px;
            }
        }
    }
}

@media (max-width: 1136px) {
    .account-module {

        .regisetr {
            .c {

                width: 100%;
            }

        }
    }
}